| Framework | Version | Minified Size (gzip) |
|---|---|---|
| Angular2 | 2 | too much |
| Ember | 2.9.1 | 110.30kb |
| Angular | 1.5.8 | 56.28kb |
| Polymer + Web Components Polyfill Lite | 1.7.0 | 50.25kb |
| React | 15.3.7 | 44.37kb |
| Web Components Polyfill | 0.7.22 | 33.66kb |
| Vue | 1.0.28 | 26.83kb |
| Vue | 2.0.5 | 24.12kb |
| Riot | 2.6.7 | 9.39kb |
Riot brings custom tags to all modern browsers. Think React + Polymer but with enjoyable syntax and a small learning curve.
<timer>
<p>Seconds Elapsed: { time }</p>
this.time = opts.start || 0
tick() {
this.update({ time: ++this.time })
}
var timer = setInterval(this.tick, 1000)
this.on('unmount', function() {
clearInterval(timer)
})
</timer>
riot.mount('timer', { start: 0 })
Custom tags lets you build complex views with HTML.
<timetable>
<timer start="0"></timer>
<timer start="10"></timer>
<timer start="20"></timer>
</timetable>
HTML syntax is the de facto language on the web and it's designed for building user interfaces. The syntax is explicit, nesting is inherent to the language and attributes offer a clean way to provide options for custom tags.
data- attributes.class={ enabled: is_enabled, hidden: hasErrors() }.render, state, constructor or shouldComponentUpdateAdd #{ items.length + 1 } or class="item { selected: flag }"If you are reading this it's already a good sign and we are thankful for it! We try our best working as much as we could on riot but your help is always appreciated.
If you want to contribute to riot helping us maintaining the project please check first the list of our open issues to understand whether there is a task where you could help.
Riot is mainly developed on UNIX systems so you will be able to run all the commands necessary to build and test the library using our Makefile. If you are on a Microsoft machine it could be harder to set up you development environment properly.
Following the steps below you should be able to properly submit your patch to the project
$ git clone git@github.com:riot/riot.git && cd riot
$ git checkout -b feature/my-awesome-patch
$ npm i
# To build and test riot
$ make riot
# To build without testing
$ make raw
# To build anytime you change a src file
$ make watch
# To bench riot ( it requires ctrl+c to exit )
$ make perf
dev branch making sure you have read our pull request templateRiot is made with :heart: by many smart people from all over the world. Thanks to all the contributors
It's actively maintained by:
FAQs
Simple and elegant component-based UI library
The npm package riot receives a total of 3,912 weekly downloads. As such, riot popularity was classified as popular.
We found that riot demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
The Socket Research team breaks down a malicious npm package targeting the legitimate DOMPurify library. It uses obfuscated code to hide that it is exfiltrating browser and crypto wallet data.
Security News
ENISA’s 2024 report highlights the EU’s top cybersecurity threats, including rising DDoS attacks, ransomware, supply chain vulnerabilities, and weaponized AI.
Security News
NIST's new password guidelines remove periodic changes and special character requirements, focusing on longer, more secure passwords for better authentication practices.